<template>
  <div class="border2">
    <h3>G 结点 --dataColor: {{ theme.dataColor }}</h3>
    <button @click="() => changeComponent_A_dataColor('red')">g中的按钮</button>
    &nbsp;
    <input
      style="max-width: 70%"
      type="text"
      placeholder="这里可以修改a节点中的dataColor"
      :value="theme.dataColor"
      @input="($event) => changeComponent_A_dataColor($event.target.value)"
    />
    <button @click="changeComponent_A_dataColor('')">resetDataColor</button>
  </div>
</template>
<script>
export default {
  // ['changeMyDataColor', 'theme']
  inject: {
    // 可以给changeMyDataColor替代名
    changeComponent_A_dataColor: {
      from: 'changeMyDataColor',
      default: () => () => {}
    },
    theme: {
      from: 'theme',
      default: () => ({})
    }
  }
}
</script>
